<template>
	<div class="h-9 flex gap-3 relative">
		<div
			class="min-w-[68px] h-full px-3 flex justify-center items-center rounded-lg cursor-pointer bg-bg-3 app-bg-react"
			@click="onLogin">
			{{ $t('account.login') }}
		</div>
		<div
			class="min-w-[80px] h-full px-3 flex justify-center items-center rounded-lg cursor-pointer bg-primary app-bg-react"
			@click="onRegister">
			{{ $t('account.register') }}
		</div>
	</div>
</template>
<script lang="ts" setup>
import { useAccountStore } from '@/store'
import { AccountShowType } from '@/types'

defineOptions({ name: 'AppAccountAction' })

const accountStore = useAccountStore()

const onLogin = () => {
	accountStore.showAccount(AccountShowType.login)
}

const onRegister = () => {
	accountStore.showAccount(AccountShowType.register)
}
</script>
